<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
		<title>我的收藏</title>
		<link rel="stylesheet" href="$!rc.contextPath/common/common.css" />
		<link rel="stylesheet" href="$!rc.contextPath/common/dropload.css" />
		<link rel="stylesheet" type="text/css" href="$!rc.contextPath/css/mycollect.css"/>		
		
	</head>
	<body>
		<!--顶部-->
		<div class="title text-center">
			<a onClick="javascript:window.history.go(-1)"><</a>
			我的收藏
		</div>
		<article>
			<div class="content">
				<ul class="block lists">
					
				</ul>
			</div>
			
		</article>
		
	</body>
	<script src="$!rc.contextPath/common/jquery-1.8.3.min.js" type="text/javascript"></script>
	<script src="$!rc.contextPath/common/dropload.min.js"></script>
	<script type="text/javascript">
		
	$(function(){
		
		//清除浮动
		$(".content ul").css("clear","both");
		//tab选项卡
		$(".headlines-title li").click(function(){
			var Index = $(this).index();
			$(".headlines-title li").eq(Index).addClass("active").siblings().removeClass("active");
			$(".headlines-title li").eq(Index).children("span").addClass("active-line-bottom").parent().siblings().children("span").removeClass("active-line-bottom");
			$(".content ul").eq(Index).addClass("block").siblings().removeClass("block");
	
		})
		
		f_init();
	});
	
	function f_init(){
		$(".lists").empty();
		$(".dropload-down").remove();
		
		var counter = 0;
	    // 每页展示4个
	    var num = 5;
	    var pageStart = 0,pageEnd = 0;
	
	    // dropload
	    $('.content').dropload({
	        scrollArea : window,
	        domUp : {
	            domClass   : 'dropload-up',
	            domRefresh : '<div class="dropload-refresh">↓下拉刷新</div>',
	            domUpdate  : '<div class="dropload-update">↑释放更新</div>',
	            domLoad    : '<div class="dropload-load"><span class="loading"></span>加载中...</div>'
	        },
	        domDown : {
	            domClass   : 'dropload-down',
	            domRefresh : '<div class="dropload-refresh">↑上拉加载更多</div>',
	            domLoad    : '<div class="dropload-load"><span class="loading"></span>加载中...</div>',
	            domNoData  : '<div class="dropload-noData">~没有更多收藏了~</div>'
	        },
	        loadDownFn : function(me){
	            $.ajax({
	                type: 'POST',
	                url: '$!rc.contextPath/sku/collectList',
	                data : {
	                	startIndex : pageStart,
	                	pageSize : num
	                },
	                dataType: 'json',
	                success: function(data){
	                    var result = '';
	                    counter++;
	                    pageEnd = num * counter;
	                    pageStart += num;
	                    if(data.code == '0'){
	                    	var list = data.data;
	                    	for(var i = 0; i < list.length; i++){
		                        result += '<li id="sku_' + list[i].sku_id + '"><div class="mycollect-list-left" onclick="f_detail(' + list[i].sku_id + ')"><img src="http://app.tmaipay.com/' + list[i].attach_path + '"/></div><div class="mycollect-list-middle" onclick="f_detail(' + list[i].sku_id + ')">' + 
		                        			'<p>' + list[i].sku_name + '</p><div class="mycollect-list-middle-bottom"><p><span>￥</span><span>' + list[i].sku_price + '</span></p>' + 
		                        			'<p><span>￥</span><span>' + list[i].promotion_price + '</span></p></div></div><div class="mycollect-list-right" onclick="f_cancel(' + list[i].sku_id + ')">取消收藏</div></li>';
		                        
	                    	}
	                    	
	                    	if(list.length < 5){
	                            // 再往下已经没有数据
	                            // 锁定
	                            me.lock();
	                            // 显示无数据
	                            me.noData();
	                            //break;
	                        }
	                    }
	
                        $('.lists').append(result);
                        // 每次数据加载完，必须重置
                        me.resetload();
	                },
	                error: function(xhr, type){
	                    alert('网络故障!');
	                    // 即使加载出错，也得重置
	                    me.resetload();
	                }
	            });
	        },
	        threshold : 50
	    });
	}
	
	function f_detail(skuId){
		window.location.href = '$!rc.contextPath/skuView/detail?skuId=' + skuId;
	}
	
	function f_cancel(skuId){
		$.ajax({
            type: 'POST',
            url: '$!rc.contextPath/sku/collect',
            data : {
            	skuId : skuId
            },
            dataType: 'json',
            success: function(data){
                console.log(data);
                if(data.code == '0'){
                	$("#sku_" + skuId).remove();
                }else{
                	alert(data.text)
                }
            }
        });
	}
	</script>
</html>
